@extends('admin.pub.pub')
@section('title','角色列表')
@section('bread1','角色管理')
@section('bread2','角色列表')
@section('content')
    <div class="container">
        <div class="cl pd-5 bg-1 bk-gray mt-20">
			<span class="l">
				<a class="btn btn-primary radius" data-title="添加角色" data-href="{{ route('admin.role.create') }}"
                   onclick="Hui_admin_tab(this)" href="javascript:;">
					<i class="Hui-iconfont">&#xe600;</i> 添加角色
				</a>
			</span>
        </div>
        <table class="table table-hover">
            <thead>
            <tr>
                <th>ID</th>
                <th>角色名称</th>
                <th>操作</th>
            </tr>
            </thead>
            <tbody>
            @forelse($data as $item)
                <tr>
                    <td>{{ $item['id'] }}</td>
                    <td>{{ $item['name'] }}</td>
                    <td>
                        <a href="javascript:;" onclick="role_edit('[{{ $item['name'] }}] 角色权限','{{ route('admin.role.edit',['role'=>$item['id']]) }}')" class="btn btn-success-outline">编辑权限</a>
                        <a href="javascript:;" onclick="role_del('{{ route('admin.role.destroy',['id'=>$item['id']]) }}')" class="btn btn-danger-outline">删除</a>
                    </td>
                </tr>
            @empty
                <tr>
                    <td colspan="3">暂无数据</td>
                </tr>
            @endforelse
            </tbody>
        </table>
    </div>
@endsection
@section('js')
    <script>
        // 编辑
        function role_edit(title,url){
	        layer.open({
		        type: 2,
		        title: title,
		        content: url,
		        area:['500px','450px']
	        });
        }

        // 删除
        function role_del(url) {
        	var _token = '{{ csrf_token() }}'
            $.ajax({
                url,
                type:'DELETE',
                data:{_token},
                dataType:'json',
                success(res) {
                	if (res.status == 0) {
		                location.replace(location.href);
                    }else {
		                layer.alert('删除失败')
	                }
                }
            })
        }
    </script>
@endsection